Broken markdown conversion of “Enumerability and ownership of properties”

[hochan222]

What page(s) did you find the problem on?

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties

Specific page section or heading?

• Detecting, retrieving, and enumerating object properties

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Enumerability_and_ownership_of_properties#detecting_retrieving_and_enumerating_object_properties

What is the problem?

The conversion didn't work properly with markdown.

---

Link MDN Markdown

ex2 is a simplified version of the current documentation code. In the ex2, when I changed tr to td in tbody, it was converted well. However, looking at the ex1, it seems that there are other problems. The rule of the MDN markdown table all seem to be well maintained. What's the problem? (Of course, in ex1, tr was replaced with td in tbody.)

• ex1

<table>
  <thead>
    <tr>
      <th></th>
      <th>Own object</th>
      <th>Own object and prototype chain</th>
      <th>Prototype chain only</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Enumerable</td>
      <td>
        <p>
          <code
            ><a
              href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable"
              >propertyIsEnumerable</a
            ></code
          >
        </p>
        <p>
          <code
            ><a
              href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty"
              >hasOwnProperty</a
            ></code
          >
        </p>
      </td>
      <td>Not available without extra code</td>
      <td>Not available without extra code</td>
    </tr>
    <tr>
      <td>Nonenumerable</td>
      <td>
        <p>
          <code
            ><a
              href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty"
              >hasOwnProperty</a
            ></code
          >
          – filtered to exclude enumerables using
          <code
            ><a
              href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/propertyIsEnumerable"
              >propertyIsEnumerable</a
            ></code
          >
        </p>
      </td>
      <td>Not available without extra code</td>
      <td>Not available without extra code</td>
    </tr>
    <tr>
      <td>Enumerable and Nonenumerable</td>
      <td>
        <p>
          <code
            ><a
              href="/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty"
              >hasOwnProperty</a
            ></code
          >
        </p>
      </td>
      <td>
        <code
          ><a href="/ko/docs/Web/JavaScript/Reference/Operators/in"
            >in</a
          ></code
        >
      </td>
      <td>Not available without extra code</td>
    </tr>
  </tbody>
</table>

• ex2

<table>
    <thead>
      <tr>
        <th></th>
        <th>Own object</th>
        <th>Own object and prototype chain</th>
        <th>Prototype chain only</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <th>Enumerable</th>
        <td>
          propertyIsEnumerable
        </td>
        <td>Not available without extra code</td>
        <td>Not available without extra code</td>
      </tr>
      <tr>
        <th>Nonenumerable</th>
        <td>
            hasOwnProperty
        </td>
        <td>Not available without extra code</td>
        <td>Not available without extra code</td>
      </tr>
      <tr>
        <th>Enumerable and Nonenumerable</th>
        <td>
          hasOwnProperty
        </td>
        <td>
          in
        </td>
        <td>Not available without extra code</td>
      </tr>
    </tbody>
  </table>

There is th in the body, so the conversion was not done.

What did you expect to see?

It should be converted to markdown.

Did you test this? If so, how?

no

[sideshowbarker]

alerting @wbamberg

[wbamberg]

I'm not quite sure what the issue is here, sorry. Is it that either of ex1 or ex2 should be being converted to MD but are staying in HTML?

I haven't tried them, but looking at them I would expect:

• ex1 won't be converted because some of the cells contain block elements (<p> elements in row 2, column 2, for example)
• ex2 won't be converted because it has a header column

Is that not what you are seeing, not what you would expect, or is the problem something else?

[hochan222]

• So the general principle here is: authors should use the GFM Markdown syntax when they can, and fall back to raw HTML when they have to. - Markdown in MDN -

I thought it was possible to convert to a markdown table according to the following principle, so it was a simple report.

However, I don't know why the conversion doesn't work, so asking that makes issue confused.

ex1 won't be converted because some of the cells contain block elements (<p> elements in row 2, column 2, for example)

• GFM won't parse GFM block elements in table cells. For example, you can't have a list in a table cell. - Markdown in MDN -

I did not understand the expression of GFM block elements well. However, It seems to fit this principle.

---

I make a draft and the UI of the table became beautiful from the user's point of view, but I am not sure if it improved in terms of readability from maintainer. In this case, would it be better to convert it to markdown?

• before

• after

[wbamberg]

In this case, would it be better to convert it to markdown?

If I understand you, I think it's probably best not to convert this table to Markdown. For one thing we lost the heading column but for another, as you say, the Markdown is very hard to read.

I think Markdown tables work quite well for simple tables, especially where the cell contents is quite short. For example, some of the tables in https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness look good in Markdown:

| number              | bigint                    | string    | boolean                       | Object                |
| ------------------- | ------------------------- | --------- | ----------------------------- | --------------------- |
| `ToNumber(A) === B` | `StringToBigInt(A) === B` | `A === B` | `ToNumber(A) === ToNumber(B)` | `A == ToPrimitive(B)` |

| x                   | y                   | `==`       | `===`      | `Object.is` | `SameValueZero` |
| ------------------- | ------------------- | ---------- | ---------- | ----------- | --------------- |
| `undefined`         | `undefined`         | `✅ true`  | `✅ true`  | `✅ true`   | `✅ true`       |
| `null`              | `null`              | `✅ true`  | `✅ true`  | `✅ true`   | `✅ true`       |
| `true`              | `true`              | `✅ true`  | `✅ true`  | `✅ true`   | `✅ true`       |
| `false`             | `false`             | `✅ true`  | `✅ true`  | `✅ true`   | `✅ true`       |
| `'foo'`             | `'foo'`             | `✅ true`  | `✅ true`  | `✅ true`   | `✅ true`       |
| `0`                 | `0`                 | `✅ true`  | `✅ true`  | `✅ true`   | `✅ true`       |
| `+0`                | `-0`                | `✅ true`  | `✅ true`  | `❌ false`  | `✅ true`       |
| `+0`                | `0`                 | `✅ true`  | `✅ true`  | `✅ true`   | `✅ true`       |
| `-0`                | `0`                 | `✅ true`  | `✅ true`  | `❌ false`  | `✅ true`       |
| `0n`                | `-0n`               | `✅ true`  | `✅ true`  | `✅ true`   | `✅ true`       |
| `0`                 | `false`             | `✅ true`  | `❌ false` | `❌ false`  | `❌ false`      |
| `""`                | `false`             | `✅ true`  | `❌ false` | `❌ false`  | `❌ false`      |
| `""`                | `0`                 | `✅ true`  | `❌ false` | `❌ false`  | `❌ false`      |
| `'0'`               | `0`                 | `✅ true`  | `❌ false` | `❌ false`  | `❌ false`      |
| `'17'`              | `17`                | `✅ true`  | `❌ false` | `❌ false`  | `❌ false`      |
| `[1, 2]`            | `'1,2'`             | `✅ true`  | `❌ false` | `❌ false`  | `❌ false`      |
| `new String('foo')` | `'foo'`             | `✅ true`  | `❌ false` | `❌ false`  | `❌ false`      |
| `null`              | `undefined`         | `✅ true`  | `❌ false` | `❌ false`  | `❌ false`      |
| `null`              | `false`             | `❌ false` | `❌ false` | `❌ false`  | `❌ false`      |
| `undefined`         | `false`             | `❌ false` | `❌ false` | `❌ false`  | `❌ false`      |
| `{ foo: 'bar' }`    | `{ foo: 'bar' }`    | `❌ false` | `❌ false` | `❌ false`  | `❌ false`      |
| `new String('foo')` | `new String('foo')` | `❌ false` | `❌ false` | `❌ false`  | `❌ false`      |
| `0`                 | `null`              | `❌ false` | `❌ false` | `❌ false`  | `❌ false`      |
| `0`                 | `NaN`               | `❌ false` | `❌ false` | `❌ false`  | `❌ false`      |
| `'foo'`             | `NaN`               | `❌ false` | `❌ false` | `❌ false`  | `❌ false`      |
| `NaN`               | `NaN`               | `❌ false` | `❌ false` | `✅ true`   | `✅ true`       |

...but where the rows get very long the HTML version seems more readable to me.

Does that make sense to you?

[hochan222]

Thank you for your kind reply.

I think the condition for conversion based on readability should be explicitly included in that documentation. Or it seems like all conversions will be done indiscriminately with markdown.

Next time, I will approach the problem with that thought in the conversion.

Have a nice day!

---

• https://developer.mozilla.org/en-US/docs/MDN/Contribute/Markdown_in_MDN#tables

[wbamberg]

Thanks @hochan222 for being engaged with the Markdown conversion project!

I think the condition for conversion based on readability should be explicitly included in that documentation.

I agree and have filed #7397 for this.